import React, { useEffect } from 'react'
import Navbar from '../../../compounts/navber/Navbar'
import { Button, Dialog, Space, Toast, Divider } from 'antd-mobile'
import style from './user.module.css'
import { useNavigate } from 'react-router-dom'

function Index() {
    const navigate = useNavigate();

    const handleLogout = () => {
        localStorage.clear()
        Toast.show('退出登录成功');
        navigate('/login');
    }



    return (
        <div className={style.box}>
            <Navbar title='系统设置'></Navbar>
            用户设置
            <Button shape='rounded' block color='primary' size='large'
                onClick={() => {
                    Dialog.show({
                        content: '确定要退出本次登录吗？',
                        closeOnAction: true,
                        actions: [
                            [
                                {
                                    key: 'cancel',
                                    text: '取消',
                                },
                                {
                                    key: 'delete',
                                    text: '确定',
                                    bold: true,
                                    danger: true,
                                    onClick: handleLogout
                                },
                            ],
                        ],
                    })
                }}
            >
                退出登录
            </Button>

            
        </div>
    )
}

export default Index
